<template>
	<div class="right-menu-box"> 
		<ul>
      <i @click='closeMenu' class="iconfont icon-close"></i>
			<li @click='addClass'><i class="iconfont icon-add"></i><span>添加课程</span></li>
      <li @click='loginOut'><i class="iconfont icon-loginout"></i><span>退出登陆</span></li>
		</ul>
	</div>
</template>
<script>
export default {
  methods:{
    addClass(){
      this.$router.push('/addclass')
    },
    loginOut(){
        localStorage.removeItem('user');
        localStorage.removeItem('idCardNum');
        this.$router.replace('/login')
    },
    closeMenu(){
      this.$parent.menuVisibel=false
    }
  }
}
</script>
<style scoped>
  ul{
    width: 50%;
    background: #35495e;
    padding: 20px 10px;
    position: absolute;
    top:0;
    right: 0;
    height: 100%;
  }
  li{
    list-style: none;
    padding:5px 10px;
    background: #999;
    margin: 5px 0;
    font-size: 16px;
  }
  li i{margin-right: 10px;}
  .right-menu-box{
    width: 100%;
    height: 100%;
    color:#fff;
  }
  .icon-close{
    font-size: 25px;
    padding: 10px;
  }
</style>